<!DOCTYPE html>
<html>
  
  <head>
    <meta charset="UTF-8">
    <title>号码检索</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" href="/static/css/font.css">
    <link rel="stylesheet" href="/static/css/xadmin.css">
    <script type="text/javascript" src="/static/js/jquery.min.js"></script>
    <script type="text/javascript" src="/static/lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="/static/js/xadmin.js"></script>
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
      <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
      <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  
  <body>
      <div class="x-body">
          <div class="demoTable">
              <div class="layui-inline" >
                  <input  id="demoReload_t" name="keyword_t" autocomplete="off" class="layui-input">
                </div>
              <input type="radio" name="keyword_r" id="demoReload_r" value="user_name" checked="">
              <a>姓名</a>
              <input type="radio" name="keyword_r" id="demoReload_r" value="phone_number">
              <a>手机号码</a>
              <input type="radio" name="keyword_r" id="demoReload_r" value="short_number">
              <a>集团短号</a>
            <button class="layui-btn"  data-type="reload" ><i class="layui-icon">&#xe615;</i></button>
        </div> 
        <table class="layui-hide" id="demo" lay-filter="user"></table>
      </div>
      <script>
          layui.use('table',function(){
            var table = layui.table;
            //执行一个laydate实例
            table.render({
              elem:'#demo',
              method:'post',
              url:'/search/',
              cellMinWidth:80,
              toolbar:'#toolbarDemo',
              id:'pushReload',
              page:true
              ,cols:[[
                ,{field:'i_id',title:'ID'}
                ,{field:'user_name',title:'姓名'}
                ,{field:'phone_number',title:'手机号码',sort:true}
                ,{field:'short_number',title:'集团短号',sort:true}
              ]]
            });
            var $ = layui.$, active={
              reload:function(){
                var demoReload_t = $('#demoReload_t');
                var demoReload_r = $("input[type='radio']:checked");
                table.reload('pushReload',{
                  page:{
                    curr:1
                  }
                  ,where:{
                    keyword_t:demoReload_t.val(),
                    keyword_r:demoReload_r.val()
                  }
                });
              }
            };
            $('.demoTable .layui-btn').on('click',function(){
          var type = $(this).data('type');
          active[type] ? active[type].call(this) : '';
        });
          });
        </script>
      </body>
</html>